<template>
    <a-space direction="vertical" size="small">
        <a-row :gutter="10">
            <a-col :span="3">DB</a-col>
            <a-col :span="7">traffic</a-col>
            <a-col :span="7">syn</a-col>
            <a-col :span="7">energy</a-col>
        </a-row>
        <template v-for="item in tests" :key="item.id">
            <a-row :gutter="10">
                <a-col :span="3">{{item.title}}</a-col>
                <a-col :span="7">
                    <test-history :row="item.id" col="traffic"></test-history>
                </a-col>
                <a-col :span="7">
                    <test-history :row="item.id" col="syn"></test-history>
                </a-col>
                <a-col :span="7">
                    <test-history :row="item.id" col="energy"></test-history>
                </a-col>
            </a-row>
        </template>
    </a-space>
</template>

<script>
/* eslint-disable */
import { defineComponent } from "vue";
import TestHistory from './TestHistory.vue'

export default defineComponent({
    components: { TestHistory },
    name: "InfoPanel",
    setup() {
        return {
            sortbyname: true,
            // tests:[
            //     {
            //         id: 'pg',
            //         title: 'PG',
            //         content: {
            //             syn: [ 'pg', 'ma', 'n1', 'n2', 'tgk', 'tgi' ],
            //             energy: [ 'pg', 'ma', 'n1', 'n2', 'tgk', 'tgi' ],
            //             traffic: [ 'pg', 'ma', 'n1', 'n2', 'tgk', 'tgi' ],
            //         }
            //     }
            // ]
        };
    },
    created() {
        // console.log(this.$store.state.results)
    },
    computed:{
        tests(){
            let dbs = this.$store.getters.dbList
            console.log()
            let dataset = [ 'syn', 'energy', 'traffic']
            return dbs.map(db=>{
                let content = {}
                for(let d of dataset){
                    content[d] = []
                }
                return {
                    id: db,
                    title: db.toUpperCase(),
                    content,
                }
            })
        }
    }
});
</script>

<style>
</style>